<template>
  <div>
    <!-- 特殊车辆首保查询-->
    <TopFilter ref="TopFilterss" :list="topFilterInit" :cols="3" :collapse="collapse" labelWidth="90" @filterChange="changeHandle"> </TopFilter>
    <FilterTable ref="table" :columns="columns" :params="fetchParams" :fetchapi="fetchapi" :datakey="'records'" :is-select-column="false" :onColumnsChange="columns => (this.columns = columns)">
      <template slot="controls" slot-scope="props">
        <multiuse-button type="primary" :click="exportFileBtn.bind()">导出</multiuse-button>
      </template>
    </FilterTable>
    <BaseDialog :visible.sync="visible" :title="'车型新增'" width="850px" destroyOnClose :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}">
      <vehicle @close="close" @save="save"></vehicle>
    </BaseDialog>
    <BaseDialog :visible.sync="visibleEdit" :title="'编辑'" destroyOnClose :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}">
      <EditForm :rowData="rowData" @close="editclose" @save="editsave"></EditForm>
    </BaseDialog>
    <BaseDialog :visible.sync="visibleAdd" :title="'配件新增'" destroyOnClose width="850px" :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}">
      <AddForm @close="closeAdd" @save="saveAdd"></AddForm>
    </BaseDialog>
    <BaseDialog :visible.sync="showImport" icon="el-icon-upload" title="导入" width="800px" destroyOnClose :containerStyle="{ height: '100%', overflow: 'auto'  }">
      <importPeiJianLeiXingWeiHu @importclose="editsave()" />
    </BaseDialog>
  </div>
</template>
<script>
  import { dictionary } from '@/utils/dictMixin';
  import vehicle from '@/pages/claimDemage/tools/ModelVehicle.vue';
  import { exportExcelFile } from '@/utils/index';
  import { getListByPage, getPartType, addOrders, excelExport, getListForExport, deleteOne, downloadModel,exporturl } from '@/api/claim/dealer/SpecialCarFirstWarrantyQuery';
  import { getPart } from '@/api/dictionary/index';
  export default {
    mixins: [dictionary],
    components: {
      vehicle
    },
    data() {
      return {
        dataList: [],
        visibleEdit: false,
        visibleDrawer: false,
        collapse: false,
        visible: false,
        showImport: false,
        exportLoading: false,
        infoId: null,
        fetchapi: getListByPage,
        topFilterInit: this.topFilterInitFun(),
        flterValue: {},
        columns: this.creatHeader(),
        fetchParams: {},
        selectedRows: [],
        rowData: {},
        visibleAdd: false,
        res: []
      };
    },
    created() {
      this.chuqi();
      this.chuqi1();
    },
    methods: {
      close() {
        this.visible = false;
      },
      chooseOrderNo() {
        this.visible = true;
      },
      save(obj) {
        this.topFilterInit.find(x => x.fieldName == 'modelCode').initialValue = obj[0].modelCode;
        this.visible = false;
      },
      async chuqi() {
        const res = await getPart();
        if (res.resultCode == 200) {
          this.topFilterInit.find(x => x.fieldName == 'typeId').initialValue = '';
          this.topFilterInit.find(x => x.fieldName == 'typeId').itemList = res.data.map(y => ({
            text: y.name,
            value: y.code
          }));
        }
      },
      async chuqi1() {
        const res1 = await getPartType({type: 5593});
        if (res1.resultCode == 200) {
          this.topFilterInit.find(x => x.fieldName == 'type').initialValue = '';
          this.topFilterInit.find(x => x.fieldName == 'type').itemList = res1.data.map(y => ({
            text: y.codeCnDesc,
            value: y.codeId
          }));
        }
      },
      closeAdd() {
        this.visibleAdd = false;
        this.fetchParams = {...this.fetchParams};
      },
      saveAdd() {
        this.visibleAdd = false;
        this.fetchParams = {...this.fetchParams};
      },
      add() {
        this.visibleAdd = true;
      },
      emitFun(val) {
        this.rowData = val;
        this.visibleEdit = true;
      },
      editclose() {
        this.visibleEdit = false;
        this.fetchParams = {...this.fetchParams};
      },
      editsave() {
        this.showImport = false;
        this.fetchParams = {...this.fetchParams};
      },
      //搜索获取数据
      changeHandle(val) {
        this.fetchParams = Object.assign({}, this.fetchParams, val);
      },
      // 删除
      async delFun(val) {
        this.$confirm('确定删除吗？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(async () => {
            this.res = await deleteOne(val.warrantyId);
            if (this.res.resultCode != 200) {
              this.$notify.error({title: '提示信息', message: res.errMsg || '删除失败!'});
            } else {
              this.$notify.success({title: '提示信息', message: '删除成功!'});
              // 重新加载
              this.fetchParams = {...this.fetchParams};
            }
          })
      },
      // Excel更新导入
      showImportFun() {
        this.showImport = true;
      },
      //下载模板
      downloadTemplate() {
        this.$confirm('此操作将下载excel模板, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.exportLoading = true;
          downloadModel().then(res => {
            console.log('666');
            console.log(res);
            exportExcelFile(res, '一般车辆备件类型保修期维护导入模板');
            this.exportLoading = false;
          });
        });
      },
      // 导出
     async exportFileBtn() {
      let json = Object.assign({}, { CODE: 'CODE_00000188' }, this.fetchParams);
      let res = await exporturl(json);
      if (res.resultCode == 200) {
        this.$router.push('/admin/auth/oem/downloadCenter');
      }
        // getListForExport(this.fetchParams).then(res => {
        //   exportExcelFile(res.data, '特殊车辆首保查询');
        // });
      },
      //搜索数据
      topFilterInitFun() {
        return [
          {type: 'INPUT', label: 'VIN', fieldName: 'vin', placeholder: '请输入VIN...', initialValue: ''},
          {
            type: 'INPUT',
            label: '车型',
            fieldName: 'modelCode',
            placeholder: '请输入车型...',
            initialValue: '',
            unitRender: p => {
              return (
                <div>
                  <multiuse-button icon="el-icon-search" onClick={() => this.chooseOrderNo()}/>
                </div>
              );
            }
          },
          {
            type: 'SELECT',
            label: '类型',
            fieldName: 'type',
            placeholder: '请选择类型...',
            initialValue: '',
            filterable: true,
            itemList: []
          }
        ];
      },
      //table表头和数据源
      creatHeader() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            fixed: 'left',
            width: 80,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          {title: 'VIN', dataIndex: 'vin', sorter: true},
          {title: '车型', dataIndex: 'modelCode', sorter: true},
          {title: '车型名称', dataIndex: 'modelName', sorter: true},
          {title: '类型', dataIndex: 'typeStr', sorter: true},
          {title: '备注', dataIndex: 'remarks', sorter: true},
          {title: '创建人', dataIndex: 'createdBy', sorter: true},
          {title: '创建时间', dataIndex: 'createdAt', sorter: true},
          {title: '修改人', dataIndex: 'updatedBy', sorter: true},
          {title: '修改时间', dataIndex: 'updatedAt', sorter: true},
          // {title: '主键', dataIndex: 'warrantyId', sorter: true, hidden: true}
        ];
      }
    }

  };
</script>

<style lang="less" scoped></style>
